Live Music Archive
Librivox Free Audio
Metropolitan Museum
Cleveland Museum of Art
Internet Arcade
Console Living Room
Books to Borrow
Open Library
TV News
Understanding 9/11Wgo.js Player Version 2.0 (wgo.player-2.0.zip)
Item Preview
(Source: http://wgo.waltheri.net/player (official website))
Background of SGF player: What is behind WGo.js ?
WGo.js is javascript library for purposes of go game. The basic idea of this library is to help to create go web application easily without laborious programming of game's logic or board graphic interface. It is descendant of WGoApi and we can say WGo.js is second version of this library. Jan Prokop decided to remove word 'Api' from the name and add suffix '.js' as is common for javascript libraries. But in texts he uses shortly WGo.
WGo.js contains two main components:
- Board - graphical go board implemented in HTML5 canvas. It has extensive API for easy manipulation. You can add and remove predefined objects like stones on board, you can create your own objects, or even make cut-outs of board.
- Game - object for storing of game's position and controling game's flow. With method
playyou can play move and create new position with rules applied.
WGo is written in javascript with help of HTML5 and WGo applications should work fine in all new browsers, even on Androids and iPhones. Unfortunately it won't work on Internet Explorer 8 and lower, because of absence of canvas element, which is crucial for drawing of a board.
WGo.js also comes with powerful go player, or more precisely sgf game viewer (SGF = Smart Game Format), which can be embedded into websites. This player is designed to be unlimitedly extendable.
(A) SGF Player (file: wgo.player-2.0.zip)
WGo.js Player is the most significant component of the WGO.js javascript library for purposes of go game (also known as Baduk (Korea), Weiqi (China) or Igo (Japan). It is an application for viewing and replaying go game records that can be embedded into any website. Basically it does the same job as Eidogo or GOswf but trying to be better.
Features
- No needs of third party software like Flash Player or Java.
- Works on mobile devices.
- Easy theming through css.
- Many possible layouts.
- Responsive - player can have any dimensions, and they can be changed any time.
- Replaying games using mouse wheel
- Permanent links
- Highlighting of coordinates mentioned in comments
- Score mode
- Extendable - you can add new functionality to a player.
- Internationalization
Getting started
---Quick Example
Installation
Basic installation of WGo.js Player is shown in example above. Both files (wgo.min.js and wgo.player.min.js) must be included in that order. You can download the Version 2.0 here as zipped file. However these script tags can be placed anywhere in the document. You can also add language .js file to display the player in different language.
Internationalisation / Translation
WGo Player can be translated into any language. If translation already exists, you just include language file after other WGo javascript files.
In the sub directory .../Translations you can find all existing translations (Czech: i18n.cs.js / Italian: i18n.it.js / English: i18n.en.js). If a translation into your language doesn't exist, you can create it.
You must copy english language file (i18n.en.js) and replace all english strings with your strings. Then include this new file into your document.
You can also send the new language file to the owner Jan Prokop (via email thebestgoplayer@gmail.com) and he will publish it on the official website.
Look & Feel (Design / Themes)
In wgo.player.css is defined player's look (as standard setup. wgo.player.dark.css is a dark theme as alternative you find in the ".../Themes" subdirectory for individual download. It is not included in the zip file).
Here an example for the look & feel of the Basic Installation (see upper html code under 'Quick Example') with implementation of the standard SGF file (electronic transciption file of a Go game). It documents a historical game between Ebizawa Kenzo (3D / black) vs. Honinbo Shusaku (7D / white) and was played in Japan on 12th March 1859. (Rec.: Following the Go rules black received two (2) handicap stones as the weaker player.)
(Rec.: The SGF you find in the subdirectory .../SGF/Ebizawa_Kenzo-Honinbo_Shusaku-1859-03-12.sgf)
Test on your own the interactive player directly here with pure html.Embedding a player
There are 2 options of inserting SGF player into a website. You can use pure HTML or javascript. Javascript is more convenient for advanced tasks. Following shows you both ways.
HTML
Player will be triggered in an element when you specify attributedata-wgo. Then you can use other data-wgo-* attributes to configurate the player. Dimensions, margins etc. are set exclusively by CSS.
To create a read-only diagram you can use the attributedata-wgo-diagram instead. This will disable all controls and renders only the board. This is a shortcut for specifying an empty layout and disable the wheel and key input and does not mark the last move made with a circle.Javascript
Embedding a player directly with javascript is less elegant, but you can set any configuration freely, for example by javascript function. You can also save player's instance for further manipulation.
Mouse and keyboard input
WGo Player can be controlled by arrow keys and mouse wheel in default. However you can turn off this behaviour if you set attributes data-wgo-enablewheel and data-wgo-enablekeys or properties enableWheel and enableKeys to false. Of course you can disable only wheel or only keys.
Formatting of comments
WGo Player has ability to format comment text. It can highlight nicknames (string at the beginnig of a line followed by a colon) and coordinates (strings like A1). Moreover when you hover coordinates, mark will be displayed on the board at corresponding position. If you dislike these features set attributes data-wgo-formatnicks and data-wgo-formatmoves or properties formatNicks and formatMoves to false. If you don't know how, look at example above.
Player's events
WGo Player dispatches several types of events and you can attach listeneres to them. Listener is a function which is called when given event occures. Function is an executable javascript code, so if you don't know javascript, this section won't be much useful for you. You can listen any of these events:
* kifuLoaded - dispatched when new kifu is fully loaded and ready for replaying. Function is called with one argument, event object with these properties: type - name of event. target - current player object. kifu - kifu object. * update - dispatched after every change of game's position. Function is called with one argument, event object with these properties: type - name of event. target - current player object. op - operation which triggered the event ("next", "previous", etc...). node - current node object. position - current position object. path - current path object. change - object containg last changes. * frozen - dispatched when the player freezes. In frozen state you can't replay kifu. Function is called with one argument, event object with these properties: type - name of event. target - current player object. * unfrozen - dispatched when the player stops being frozen. Function is called with one argument, event object with these properties: type - name of event. target - current player object.If you are using javascript to embed the player, set properties of configuration object with same names as events. In HTML there are attributes: data-wgo-onkifuload, data-wgo-onupdate, data-wgo-onfrozen and data-wgo-onunfrozen.
